<template>
  <div class="newAlarmInfo">
    <!-- 筛选条件 -->
    <ContentWrap>
      <el-form
        ref="queryFormRef"
        class="-mb-15px"
        :model="queryParams"
        :inline="false"
        label-width="130px"
      >
        <el-row :gutter="20">
          <el-col :span="6">
            <el-form-item label="姓名" prop="patientName">
              <el-input v-model="queryParams.patientName" placeholder="请输入姓名" clearable />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="身份证号码" prop="idNumber">
              <el-input v-model="queryParams.idNumber" placeholder="请输入身份证号" clearable />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="6" class="text-right">
            <el-form-item>
              <el-button
                type="primary"
                @click="handleQuery"
                v-hasPermi="['patients:alarmInfo:query']"
                >查询</el-button
              >
              <el-button @click="resetQuery">重置</el-button>
              <el-button type="primary" @click="sendAll" v-hasPermi="['patients:alarmInfo:send']">
                一键发送
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </ContentWrap>
    <ContentWrap>
      <div class="content">
        <!-- 区域树 -->
        <div class="tree-box">
          <RegionTree v-model:checkedKeys="selectedKeys" :isExpand="true" :checkStrictly="false" />
        </div>
        <div style="width: 80%; height: calc(100vh - 265px)">
          <el-table
            size="large"
            v-loading="loading"
            :data="lists"
            border
            style="width: 100%"
            height="90%"
          >
            <!-- 序号 -->
            <el-table-column type="index" label="序号" width="80" align="center" fixed />
            <el-table-column
              label="姓名"
              prop="patientName"
              width="110"
              show-overflow-tooltip
              align="center"
            />
            <el-table-column label="性别" prop="gender" width="80" align="center">
              <template #default="scope">
                {{ getDictLabel(DICT_TYPE.GENDER, scope.row.gender) }}
              </template>
            </el-table-column>
            <el-table-column
              label="证件号"
              prop="idNumber"
              width="220"
              show-overflow-tooltip
              align="center"
            />
           <el-table-column
              label="所属机构"
              prop="managementOrgName"
              width="230"
              show-overflow-tooltip
              align="center"
            />
            <el-table-column
              label="上次随访结果"
              prop="prevRiskAssessment"
              width="230"
              show-overflow-tooltip
              align="center"
            ><template #default="scope">
                {{ getDictLabel(DICT_TYPE.RISK_ASSESSMENT, scope.row.prevRiskAssessment) }}
              </template>
            </el-table-column>
            <el-table-column label="上次随访时间" prop="prevFollowupDate" width="150" align="center">
              <template #default="scope">
                {{ formatDate(scope.row.prevFollowupDate, 'YYYY-MM-DD') }}
              </template>
            </el-table-column>
             <el-table-column
              label="本次随访结果"
              prop="latestRiskAssessment"
              width="230"
              show-overflow-tooltip
              align="center"
            >
               <template #default="scope">
                {{ getDictLabel(DICT_TYPE.RISK_ASSESSMENT, scope.row.latestRiskAssessment) }}
              </template>
            </el-table-column>
            <el-table-column label="本次随访时间" prop="latestFollowupDate" width="150" align="center">
              <template #default="scope">
                {{ formatDate(scope.row.latestFollowupDate, 'YYYY-MM-DD') }}
              </template>
            </el-table-column>
            <el-table-column label="操作" width="220" align="center" fixed="right">
              <template #default="scope">
                <el-button
                  v-hasPermi="['patients:alarmInfo:detail']"
                  type="primary"
                  link
                  @click="detail(scope.row.patientCode)"
                >
                  详情
                </el-button>
                <!-- <el-button
                  v-hasPermi="['business:key-person-protection:create']"
                  type="danger"
                  :disabled="scope.row.boolFiveInOne === '1'"
                  link
                  @click="saveFiveOne(scope.row)"
                >
                  判为五帮一
                </el-button> -->
              </template>
            </el-table-column>
          </el-table>
          <!-- 分页 -->
          <Pagination
            :total="total"
            v-model:page="queryParams.pageNo"
            v-model:limit="queryParams.pageSize"
            @pagination="getLists"
          />
        </div>
      </div>
    </ContentWrap>
    <RiskAlarmInfoDetail ref="riskAlarmInfoDetailRef" />
  </div>
</template>

<script lang="ts" setup name="newAlarmInfo">
import * as AlarmInfoApi from '@/api/patient/alarmInfo'
import * as FiveGuaranteesOne from '@/api/patient/fiveGuaranteesOne'
import { DICT_TYPE, getIntDictOptions, getDictLabel } from '@/utils/dict'
import { formatDate } from '@/utils/formatTime'
import RiskAlarmInfoDetail from './components/riskAlarmInfoDetail.vue'
const { t } = useI18n()
const message = useMessage()
// 选中的节点 ID
const selectedKeys = ref<string[]>([])
const queryParams = reactive({
  patientName: undefined,
  idNumber: undefined,
  deptIds: [],
  alarmType: 1, // 风险预警
  pageNo: 1,
  pageSize: 10
})

const loading = ref(true) // 列表的加载中
const lists = ref<any[]>([]) // 列表的数据
const total = ref(0) // 列表的总页数
const queryFormRef = ref() // 搜索的表单
/** 查询列表 */
const getLists = async () => {
  loading.value = true
  try {
    const data = await AlarmInfoApi.getRiskAlarm(queryParams)
    lists.value = data.list
    total.value = data.total
  } finally {
    loading.value = false
  }
}
/** 查询按钮操作 */
const handleQuery = () => {
  queryParams.pageNo = 1
  getLists()
}

/** 五包一按钮操作 */
const saveFiveOne = async (row: any) => {
  const params = {
  patientName: row.patientName,
  gender: row.gender,
  patientCode: row.patientCode,
  deptId: row.deptId,
  }
  try {
    await FiveGuaranteesOne.addFiveGuauaranteesOne(params)
    getLists()
  } catch (error) {
    console.error(error)
  }
}

/** 重置按钮操作 */
const resetQuery = () => {
  //form表单重置
  queryFormRef.value?.resetFields()
  handleQuery()
}

/** 一键发送按钮操作 */
const sendAll = async () => {
  let sendParams = []
  lists.value.forEach((item) => {
    sendParams.push({
      patientName: item.patientName,
      deptId: item.deptId
    })
  })
  await AlarmInfoApi.sendEmail(sendParams)
  message.success(t('common.emailSuccess'))
}
const sendEmail = async (row: any) => {
  let sendParams = []
  sendParams.push({
    patientName: row.patientName,
    deptId: row.deptId
  })
  await AlarmInfoApi.sendEmail(sendParams)
  message.success(t('common.emailSuccess'))
}

const riskAlarmInfoDetailRef = ref()
const detail = async (patientCode: string) => {
  riskAlarmInfoDetailRef.value.open(patientCode)
}

onMounted(() => {
  getLists()
})
// 监听勾选的值
watch(selectedKeys, (newCheckedKeys) => {
  queryParams.deptIds = newCheckedKeys // 更新queryParams中的值
  handleQuery()
})
</script>

<style lang="scss" scoped>
.content {
  display: flex;
}
.tree-box {
  width: 330px;
  height: calc(100vh - 265px);
  overflow: auto;
  margin-right: 16px;
}
.text-right {
  display: flex;
  justify-content: flex-start;
}
</style>
